/*
 * @Author: 薛严 348352046@qq.com
 * @Date: 2022-11-12 19:01:35
 * @LastEditors: ayun chengyunwu@jiatui.com
 * @LastEditTime: 2023-07-10 11:04:17
 * @FilePath: /gov-baoan-h5/src/App.tsx
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */

import { useRoutes, useNavigate, useLocation } from "react-router-dom";
import router, { withLoadingComponent } from "./router";
import VConsole from "vconsole";
import { useRef, useEffect, useState } from "react";
import { LeftOutline } from "antd-mobile-icons";
import.meta.env.VITE_ENV == "test" && new VConsole();

// 路由拦截
function BeforeRouterEnter() {
  const token = localStorage.getItem("i-token");
  const outlet = useRoutes(router);

  document.title =
    outlet?.props?.match?.route?.title ?? "福田区经济运行一网统管信息系统";

  return outlet;
}


function App() {
  const navigate = useNavigate();
  const location = useLocation();
  const [content, setContent] = useState<any>(null)
  const prevLocation: any = useRef(location);
  const currentAgent = window?.navigator?.userAgent?.indexOf('iPhone') > -1

  useEffect(() => {
    prevLocation.current = location;
  }, [location]);
  
  useEffect(() => {
    if(prevLocation?.current?.pathname != '/investment-scheduling-home' && !currentAgent){
      setContent(<div
        style={{
          width: "100%",
          height: "40px",
          position: "fixed",
          bottom: '-1px',
          background: "#eeeeee",
          textAlign: 'center'
        }}
      >
        <div 
            onClick={() => {
              if(prevLocation?.current?.pathname != '/investment-scheduling-home') {
                navigate(-1)
              }else {
                // navigate('/login')
              }
            }}
          >
          <LeftOutline
            style={{ marginTop: "10px"}}
            fontSize={24}
            
          /><span style={{verticalAlign: 'super', fontSize: '16px'}}>返回</span>
        </div>
        
      </div>)
    }else {
      setContent(null)
    }
    
  }, [location]);

  return (
    <div style={{ position: "relative" }}>
      <div className="app w">{withLoadingComponent(<BeforeRouterEnter />)}</div>
      {content}
    </div>
  );
}

export default App;
